<template>
  <div>
    <div class="langtk">
      <div class="lang_inp">
        <div class="close">
          <span @click="close">
            <a-icon type="close" />
          </span>
        </div>

        <ul>
          <li>
            <span class="lang_tit">key：</span>
            <a-input
              placeholder="请输入key"
              v-model="keyname"
              :disabled="$parent.addlang==true?false:true"
            />
          </li>
          <li v-if="language.cnName=='1'">
            <span class="lang_tit">中文：</span>
            <a-textarea  placeholder="请输入中文" v-model="cnName" :rows="4" />
          </li>
          <li v-if="language.enName=='1'">
            <span class="lang_tit">英文：</span>
            <a-textarea  placeholder="请输入英文" v-model="enName" :rows="4" />
          </li>
          <li v-if="language.dwName=='1'">
            <span class="lang_tit">德文：</span>
            <a-textarea placeholder="请输入德文" v-model="dwName" :rows="4" />
          </li>
          <li v-if="language.ruName=='1'">
            <span class="lang_tit">俄文：</span>
            <a-textarea placeholder="请输入俄文" v-model="ruName" :rows="4" />
          </li>
          <li v-if="language.jaName=='1'">
            <span class="lang_tit">日文：</span>
            <a-textarea placeholder="请输入日文" v-model="jaName" :rows="4" />
          </li>
          <li class="fot_btn">
            <a-button type="primary" @click="sublang">保存</a-button>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import qs from "qs";
export default {
  data() {
    return {
      id: this.$parent.langtklist.id_num,
      keyname: this.$parent.addlang==false?this.$parent.langtklist.keyname:'',
      cnName: this.$parent.addlang==false?this.$parent.langtklist.cnName:'',
      dwName: this.$parent.addlang==false?this.$parent.langtklist.dwName:'',
      enName: this.$parent.addlang==false?this.$parent.langtklist.enName:'',
      jaName: this.$parent.addlang==false?this.$parent.langtklist.jaName:'',
      ruName: this.$parent.addlang==false?this.$parent.langtklist.ruName:'',
      language:''
    };
  },

  methods: {
    close() {
      this.$store.state.tjwz = false;
      this.$parent.addlang=false
    },
    sublang() {
      if (this.$parent.addlang) {
       //新增
        this.axios
          .post(
            "set/lgAdd.php",
            qs.stringify({
              sqdwid: this.$store.state.bbl_sqdwid,
              keyname: this.keyname,
              cnName: this.cnName,
              enName: this.enName,
              dwName: this.dwName,
              jaName: this.jaName,
              ruName: this.ruName
            })
          )
          .then(res => {
            console.log(res);

            if (res.data.code == 303) {
              this.$store.state.tjwz = false;
              this.$parent.addlang=false
              this.$notification["success"]({
                message: "成功",
                description: res.data.msg
              });
              this.$parent.handleChangelist(this.$parent.pagination);

            } else {
              this.$notification["error"]({
                message: "失败",
                description: res.data.msg
              });
            }
          });
      } else {
        //修改
        this.axios
          .post(
            "set/lgEdit.php",
            qs.stringify({
              id_num: this.id,
              cnName: this.cnName,
              enName: this.enName,
              dwName: this.dwName,
              jaName: this.jaName,
              ruName: this.ruName
            })
          )
          .then(res => {
            console.log(res);
            if (res.data.code == 303) {
              this.$notification["success"]({
                message: "成功",
                description: res.data.msg
              });
              this.$store.state.tjwz = false;
              this.$parent.handleChangelist(this.$parent.pagination,this.$parent.serchvalue);
            } else {
              this.$notification["error"]({
                message: "失败",
                description: res.data.msg
              });
            }
          });
      }
    }
  },

  created() {
     this.language=JSON.parse(sessionStorage.getItem("language"))

  }
};
</script>

<style lang='less' scoped>
.langtk {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  .ant-input-affix-wrapper{
  width: 65%;
}
  .lang_inp {
    position: relative;
    left: 50%;
    transform: translate(-50%, 20%);
    width: 70%;
    height: 500px;
    background-color: #fff;
    text-align: left;
    overflow-x: scroll;
    .close {
      width: 100%;
      text-align: right;
      padding: 0 15px;
    }
    ul {
      padding: 30px;
      li {
        margin: 10px 0;
        .lang_tit {
          display: inline-block;
          width: 100px;
          text-align: right;
        }
        textarea {
          display: inline-block;
          width: 500px;
          vertical-align: top;
        }
        input {
          width: 500px;
        }
      }
      .fot_btn {
        text-align: right;
      }
    }
  }
}
</style>
